<template>
    <div>
        <CategorySelector :isForbiddenForm="scene == 1"></CategorySelector>
        <el-card style="margin-top:10px">
            <SpuList @changeScene="saveScene" @getSpuInfo="saveSpuInfo" v-if="scene === 1"></SpuList>
            <SpuForm @changeScene="saveScene" v-if="scene === 2"></SpuForm>
            <SkuForm v-if="scene == 3" :currentSpuInfo="currentSpuInfo" @changeScene="saveScene"></SkuForm>
        </el-card>
    </div>
</template>

<script lang="ts">
import CategorySelector from '@/components/CategorySelector/index.vue'
import SpuList from './components/SpuList.vue'
import SpuForm from './components/SpuForm.vue'
import SkuForm from './components/SkuForm.vue'
export default {
    name: 'Spu',
    components: { CategorySelector, SpuList, SpuForm, SkuForm }
}
</script>

<script lang="ts" setup>
import { ref } from 'vue'
const scene = ref(1)
const currentSpuInfo = ref([])
const saveScene = (val: number) => {
    scene.value = val
}

const saveSpuInfo = (spuInfo) => {
    // console.log('spuList',spuInfo)
    currentSpuInfo.value = {
        ...spuInfo,
        spuImageList: [], // 为了避免报错 需要添加上这两个属性
        spuSaleAttrList: []
    }
}
</script>


<style>
</style>